import "./App.css";
import P, {Baichen as B} from "./test.js"

console.log("Hello World");

// 箭头函数this

// const person = {
//   name: "baichen",
//   age: 18,
//   action: function () { // function中this在调用时根据调用者绑定
//     console.log(this)
//   }
// };

// const person = {
//   name: "baichen",
//   age: 18,
//   action: () => {
//     console.log(this) // 由于箭头函数并不会创建自己的this上下文，它会从自己的作用域链的上一层继承this，所以此时this要么是undefine，要么是window
//   }
// };

// const person = {
//   name: "baichen",
//   age: 18,
//   action: function () {
//     setTimeout(() => console.log(this), 1000); // 外层是普通函数，所以此时有this上下文，定义是this为person，所以setTimeout中定义的回调箭头函数绑定的this就为person
//   }
// };

// const person = {
//   name: "baichen",
//   age: 18,
//   action: function () {
//     setTimeout(function () {console.log(this)}, 1000); 
//   }
// };

// person.action();

// let f = person.action.bind(person);
// f();

// 对象的解构
// const person = {
//   name: "baichen",
//   age: 18,
// }

// const {name: nm, age} = person;
// console.log(nm, age);
// console.log(person.name === nm);
// console.log(Object.is(person.name, nm)); // nm为perosn.name的引用
// let {name: nm2, age2} = person;
// console.log(Object.is(person.name, nm2)); 
// nm2 = "bc";
// console.log(Object.is(person.name, nm2)); // 写时取消引用，重新指向其他字符串
// console.log(person.name, nm2); 

// let a = [1, 2, 3];
// let b = [...a, 4, 5, 6];
// console.log(...b)

const a = {name: "baichen"};
const b = {age: 18};
const c = {...a, ...b, weight: 70};
console.log(c);

console.log(P, B);

function App() {
  return (
    <div>
      <h1>Hello World</h1>
    </div>
  );
}

export default App;
